<template>
	<view class="center">
		<!-- 案件受理 -->
		<xbd-page-card>
			<template>
				<view class="title">
					基本信息
				</view>
				<image v-if="photo!==''" class="avatar" :src="photo"></image>
				<image v-else class="avatar"src="@/static/image/avatar.png" ></image>
				<view class="tag">
					<view class="left">姓名</view>
					<view class="right">{{myInfo.name || '-'}}</view>
				</view>
				<view class="tag">
					<view class="left">性别</view>
					<view class="right">{{myInfo.gender || '-'}}</view>
				</view>
				<view class="tag">
					<view class="left">出生年月</view>
					<view class="right">{{myInfo.birthday| timeFormat('YYYY-MM') || '-'}}</view>
				</view>
				<view class="tag">
					<view class="left">民族</view>
					<view class="right">{{myInfo.nation || '-'}}</view>
				</view>
				<view class="tag">
					<view class="left">籍贯</view>
					<view class="right">{{myInfo.native || '-'}}</view>
				</view>
				<view class="tag">
					<view class="left">参加工作时间</view>
					<view class="right">{{myInfo.work_time | timeFormat('YYYY-MM')  || '-'}}</view>
				</view>
				<view class="tag">
					<view class="left">学历</view>
					<view class="right">{{myInfo.education || '-'}}</view>
				</view>
				<view class="tag">
					<view class="left">政治面貌</view>
					<view class="right">{{myInfo.politics || '-'}}</view>
				</view>
				<view class="tag">
					<view class="left">工作单位</view>
					<view class="right">{{myInfo.work || '-'}}</view>
				</view>
				<view class="tag">
					<view class="left">现任职务</view>
					<view class="right">{{myInfo.now_job || '-'}}</view>
				</view>
				<view class="tag">
					<view class="left">职称</view>
					<view class="right">{{myInfo.title || '-'}}</view>
				</view>
			</template>
		</xbd-page-card>
		<xbd-page-card>
			<template>
				<view>
					<view class="title">
						考察情况
					</view>
					<view class="text">
						<parser v-if="myInfo.inspect" :html="myInfo.inspect" :tagStyle='style' />
						<text v-else>-</text>
					</view>
				</view>
			</template>
		</xbd-page-card>
		<xbd-page-card>
			<template>
				<view>
					<view class="title">
						鉴定结论
					</view>
					<view class="text">
						<parser v-if="myInfo.conclusion" :html="myInfo.conclusion" :tagStyle='style' />
						<text v-else>-</text>
					</view>
				</view>
			</template>
		</xbd-page-card>
		<xbd-page-card>
			<template>
				<view>
					<view class="title">
						备注
					</view>
					<view class="text">
						{{ myInfo.remark || '-'}}
					</view>
				</view>
			</template>
		</xbd-page-card>
	</view>
</template>

<script>
	import parser from '@/components/jyf-parser/jyf-parser.vue';
	export default {
		name: "Last",
		components: {
			parser
		},
		props: {
			myInfo: {},
			photo:''
		},
		data() {
			return {
				style: {
					'img': 'display:block;margin: 0 auto;max-width:100%;height:auto; transform: translateX(0);',
					'video': 'width:100%;height:auto;',
				},
			}
		},
		created() {
			console.log(this.myInfo)
		},
		onLoad() {
			console.log(this.myInfo)
		}
	};
</script>

<style lang="scss" scoped>
	.center {
		padding: 32rpx;
		position: relative;

		.avatar {
			position: absolute;
			top: 170rpx;
			right: 66rpx;
			width: 160rpx;
			height: 160rpx;
		}

		.tag {
			display: flex;
			align-items: center;
			margin-top: 30rpx;

			.right {
				width: 380rpx;
				flex-shrink: 0;
				font-weight: 400;
				font-size: 30rpx;
				color: #000623;
				word-wrap: break-word;
				word-break: break-all;
				white-space: pre-wrap;
			}

			.left {
				width: 180rpx;
				font-size: 26rpx;
				color: #A0A7B8;
				margin-right: 20rpx;
			}

			&:nth-last-child(1) {
				margin-bottom: 30rpx;
			}
		}

		.title {
			font-size: 36rpx;
			font-weight: 800;
			color: #000623;
			margin-bottom: 32rpx;
		}

		.text {
			font-size: 32rpx;
			font-weight: 400;
			color: #000623;
			line-height: 48rpx;
		}
	}
</style>
